<template>
  <div class="tag-portrait">
    <portrait-aside ref="portraitAside" @addItem="addItem" @clearConfig="clearConfig"></portrait-aside>
    <portrait-content ref="portraitContent"></portrait-content>
  </div>
</template>

<script>
import portraitAside from './aside/aside-item'
import portraitContent from './content/content-item'
export default {
  components: {
    portraitAside,
    portraitContent
  },
  data() {
    return {}
  },
  methods: {
    addItem(item) {
      this.$refs.portraitContent.addItem(item)
    },
    clearConfig() {
      this.$refs.portraitContent.clearConfig()
    }
  }
}
</script>

<style lang="scss">
.tag-portrait {
  padding: 0 10px 10px 10px;
  background-color: #fff;
  position: absolute;
  top: 60px;
  right: 0;
  bottom: 0;
  left: 0;
}
</style>
